<template>
	<div>
		<van-cell :title="name" :label="author" center  size="0.6rem" class="van-cell">
		  <!-- 使用 right-icon 插槽来自定义右侧图标 -->
		  <template #right-icon>
		    <van-icon name="play-circle-o" class="play-icon" @click="getPlay(id)"/>
		  </template>
		</van-cell>	
	</div>
</template>

<script>
	export default{
		name:"SongItem",
		props:["name","author","id"],
		methods:{
			getPlay(id){
				this.$router.push({
					path:"/play",
					query:{id:id}
				})
			}
		}
	}
</script>

<style scoped>
	.van-cell {
	  border-bottom: 1px solid lightgray;
	}
</style>